<div class="login">
  <div style="flex:1"></div>
  <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()" style="flex: 300px;">
    <nz-form-item>
      <nz-form-control>
        <nz-input-group [nzPrefix]="prefixUser">
          <input type="text" nz-input formControlName="userName" placeholder="用户名（学号）" onkeyup="this.value=this.value.replace(/\D/g,'')"
          onafterpaste="this.value=this.value.replace(/\D/g,'')">
        </nz-input-group>
        <nz-form-explain *ngIf="validateForm.get('userName')?.dirty&&validateForm.get('userName')?.errors">
          <ng-container *ngIf="validateForm.get('userName')?.hasError('pattern')">
            请输入正确的学号！
          </ng-container>
          <ng-container *ngIf="validateForm.get('userName')?.hasError('required')">
            请输入您的学号！
          </ng-container>
        </nz-form-explain>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-control>
        <nz-input-group [nzPrefix]="prefixLock">
          <input type="password" nz-input formControlName="password" placeholder="密码（默认helloworld）" >
        </nz-input-group>
        <nz-form-explain *ngIf="validateForm.get('password')?.dirty && validateForm.get('password')?.errors">请输入您的密码！</nz-form-explain>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-control>
        <!-- <label nz-checkbox formControlName="remember">
          <span>记住账号</span>
        </label>
        <a class="login-form-forgot" class="login-form-forgot">忘记密码</a> -->
        <button nz-button class="login-form-button" [nzType]="'primary'">登录</button>
      </nz-form-control>
    </nz-form-item>
  </form>
  <ng-template #prefixUser><i nz-icon type="user"></i></ng-template>
  <ng-template #prefixLock><i nz-icon type="lock"></i></ng-template>
  <div style="flex:1"></div>
</div>